<!DOCTYPE html>
<html lang="en"
      xmlns:th="http://www.thymeleaf.org"
      xmlns:layout="http://www.thymeleaf.org"
      layout:decorator="layout/m_master">

<div layout:fragment="content">

    <div class="page-group">
        <div class="page page_nearby_index">

            <div th:replace="layout/m_layout::m_top_nav"></div>

            <div class="head-search-wrap">
                <div class="head-search">
                    <input type="hidden" id="gender" name="gender" th:value="${gender}">
                    <a th:class="${gender eq ''?'active':''}" href="?">不限</a>
                    <a th:class="${gender eq '1'?'active':''}" href="?gender=1">只看男</a>
                    <a th:class="${gender eq '2'?'active':''}" href="?gender=2">只看女</a>
                    <div class="searchbtn refresh_nearby"><i class="icon-bottlecms-11"></i>刷新</div>
                </div>
            </div>

            <!--s: 底部导航 -->
            <div th:replace="layout/m_layout::m_nav"></div>
            <!--e: 底部导航 -->

            <div class="page-content infinite-scroll">
                <div class="bcui-infinite" pages-src="/m/ajax/center/single/nearby" pages-current="1"
                     page="1">
                    <div class="bcui-infinite-list bcui-userlist nearby_list">
                        <!--                        <div class="item">-->
                        <!--                            <div class="ub ub-ac"><a class="ub ub-f1 " href="https://demo.bottlecms.com/m/single/478">-->
                        <!--                                <div class="ub-img1" photo_mode="0"-->
                        <!--                                     style="background-image:url(https://cdn.demo.bottlecms.com/uploads/original/20200814/15351828078339d392b3500406097545.jpeg?x-oss-process=image/resize,m_fill,h_100,w_100)"></div>-->
                        <!--                                <div class="ub-f1 info">-->
                        <!--                                    <div class="nickname ellipsis"> 桃花 <i class="icon gender_2"></i> <i-->
                        <!--                                            class="icon_identity"></i> <i class="icon_usergroup icon_usergroup_2"></i>-->
                        <!--                                    </div>-->
                        <!--                                    <p class="info"> 19岁 . 167cm . 白羊座 </p></div>-->
                        <!--                                <div class="distance">距离<br><span>0m</span></div>-->
                        <!--                            </a></div>-->
                        <!--                        </div>-->
                        <!--                        <div class="item">-->
                        <!--                            <div class="ub ub-ac"><a class="ub ub-f1 " href="https://demo.bottlecms.com/m/single/477">-->
                        <!--                                <div class="ub-img1" photo_mode="0"-->
                        <!--                                     style="background-image:url(https://cdn.demo.bottlecms.com/uploads/original/20200814/b544eb0ab3b8d7bcf2eb143fbaf245d2.jpeg?x-oss-process=image/resize,m_fill,h_100,w_100)"></div>-->
                        <!--                                <div class="ub-f1 info">-->
                        <!--                                    <div class="nickname ellipsis"> 桃花 <i class="icon gender_1"></i> <i-->
                        <!--                                            class="icon_identity"></i> <i class="icon_usergroup icon_usergroup_2"></i>-->
                        <!--                                    </div>-->
                        <!--                                    <p class="info"> 30岁 . 176cm . 白羊座 </p></div>-->
                        <!--                                <div class="distance">距离<br><span>15km</span></div>-->
                        <!--                            </a></div>-->
                        <!--                        </div>-->
                        <!--                        <div class="item">-->
                        <!--                            <div class="ub ub-ac"><a class="ub ub-f1 " href="https://demo.bottlecms.com/m/single/184">-->
                        <!--                                <div class="ub-img1" photo_mode="1"-->
                        <!--                                     style="background-image:url(https://cdn.demo.bottlecms.com/uploads/original/4565c52e3a8ff9ded4308841c5ce11e6.jpeg?x-oss-process=image/resize,m_fill,h_100,w_100)"></div>-->
                        <!--                                <div class="ub-f1 info">-->
                        <!--                                    <div class="nickname ellipsis"> 对对对 <i class="icon gender_1"></i> <i-->
                        <!--                                            class="icon_usergroup icon_usergroup_3"></i></div>-->
                        <!--                                    <p class="info"> 20岁 . 150cm . 摩羯座 </p></div>-->
                        <!--                                <div class="distance">距离<br><span>49km</span></div>-->
                        <!--                            </a></div>-->
                        <!--                        </div>-->
                        <!--                        <div class="item">-->
                        <!--                            <div class="ub ub-ac"><a class="ub ub-f1 " href="https://demo.bottlecms.com/m/single/119">-->
                        <!--                                <div class="ub-img1" photo_mode="1"-->
                        <!--                                     style="background-image:url(https://demo.bottlecms.com/uploads/single/photo/8ffe090f5007f69a5539a411e3b90cc1.jpg?x-oss-process=image/resize,m_fill,h_100,w_100)"></div>-->
                        <!--                                <div class="ub-f1 info">-->
                        <!--                                    <div class="nickname ellipsis"> 你都记得 <i class="icon gender_2"></i> <i-->
                        <!--                                            class="icon_identity"></i> <i class="icon_usergroup icon_usergroup_3"></i>-->
                        <!--                                    </div>-->
                        <!--                                    <p class="info"> 20岁 . 145cm </p></div>-->
                        <!--                                <div class="distance">距离<br><span>49km</span></div>-->
                        <!--                            </a></div>-->
                        <!--                        </div>-->
                        <!--                        <div class="item">-->
                        <!--                            <div class="ub ub-ac"><a class="ub ub-f1 " href="https://demo.bottlecms.com/m/single/174">-->
                        <!--                                <div class="ub-img1" photo_mode="2"-->
                        <!--                                     style="background-image:url(https://cdn.demo.bottlecms.com/uploads/original/fad4f97b13b967d724327fc044390f8e.jpeg?x-oss-process=image/resize,m_fill,h_100,w_100)"></div>-->
                        <!--                                <div class="ub-f1 info">-->
                        <!--                                    <div class="nickname ellipsis"> 2134阿斯顿发 <i class="icon gender_1"></i> <i-->
                        <!--                                            class="icon_usergroup icon_usergroup_3"></i></div>-->
                        <!--                                    <p class="info"> 34岁 . 145cm . 水瓶座 </p></div>-->
                        <!--                                <div class="distance">距离<br><span>53km</span></div>-->
                        <!--                            </a></div>-->
                        <!--                        </div>-->
                    </div>

                    <div class="bcui-infinite-preloader" status="end">
                        <div class="bcui-flow-more"><font>加载更多</font></div>
                        <div class="bcui-flow-loading"></div>
                        <div class="bcui-flow-end"><font>没有了～</font></div>
                        <div class="bcui-flow-nothing"><font>没有找到相关数据！</font></div>
                    </div>
                </div>


            </div>
            <link href="/m/css/center/nearby.css" rel="stylesheet"/>
        </div>
    </div>


    <div th:replace="layout/m_layout::m_top_menu"></div>
    <div th:replace="layout/m_layout::systemJs"></div>

    <script type="text/javascript">
        // 加载最新单身列表
        var src = $('.bcui-infinite').attr('pages-src');
        var thisload = bottlecms.load({
            done: function (page, next) {
                var location = bottlecms.cookie('location');
                var json = eval('(' + location + ')');
                bottlecms.get(src, {
                    page: page,
                    gender: $("#gender").val(),
                    lat: json.lat,
                    lng: json.lng,
                    city: json.city
                }, function (data) {
                    var lis = [];
                    for (var o in data.list) {
                        lis.push(nearby_template(data.list[o]))
                    }
                    next(lis.join(''), lis.length);
                })
            }
        })
        // thisload.init();
        loadExtend(['geolocation'], function () {
            getLocation2(function (data) {
                if (data) {
                    thisload.init();
                }
            })
        });

        // 定位
        function getLocation2(refun) {
            if (bottlecms.cookie('location') != null) {
                if (refun) return refun(bottlecms.cookie('location'));
            } else {
                var geolocation = new qq.maps.Geolocation("2TNBZ-G6OH2-FQSUC-CMZOH-QUA2Z-2BBFI", "myapp");
                var positionNum = 0;
                $(function () { //定位
                    geolocation.getLocation(function (position) {
                            var positionstr = JSON.stringify(position);
                            if (positionstr != "") {
                                bottlecms.cookie('location', positionstr, {
                                    expires: 1000
                                });
                                if (refun) return refun(positionstr);
                            }
                            return false;
                        },
                        geolocation.getIpLocation(
                            function (position) {
                                console.log(position);
                                if (bottlecms.cookie('location') == null) {
                                    var positionstr = JSON.stringify(position);
                                    bottlecms.cookie('location', positionstr, {
                                        expires: 1000
                                    });
                                    if (refun) return refun(positionstr);
                                }
                            }
                        ),
                        function () {
                            $('.radar_loading .tishi, .radar_loading .radar-box').hide();
                            $('.radar_loading .fail').show();
                            bottlecms.toast("获取位置失败!");
                        }, {
                            timeout: 5000
                        });
                })
            }
        }

        $('.refresh_nearby').click(function (event) {
            bottlecms.cookie('location', null);
            location.href = location.href;
        });
    </script>

</div>
</html>
